import  React from 'react'
import {useEffect,useState} from 'react'
import { Carousel } from 'antd';
import 'antd/dist/antd.css';
import TextLoop from "react-text-loop";
import imgs from "../pic/favicon.ico"
import {Button} from "antd";

const requireContext = require.context('../pic/', true, /^\.\/.*\.jpg$/)
const images = requireContext.keys().map(requireContext)


export default function ChPage() {
    const [Jumptime,setJumptime]=useState(10)
    const contentStyle = {
  height: '160px',
  color: '#fff',
  lineHeight: '160px',
  textAlign: 'center',
  background: '#364d79',
};
    const elements=[];
    const result=[];
    let jumptime=10;
    images.forEach((item)=>{
        elements.push(
            <img src={item.default} alt="123124" width={200} height={200}/>
        )
    })
    console.log(images[1].default)
   return <div>

<p><td> <TextLoop interval={Jumptime}>
                        {elements}
                    </TextLoop>{""}</td>
                   <td> <TextLoop interval={Jumptime}>
                        {elements}
                    </TextLoop>{""}</td>
</p>
       <Button onClick={()=>{
                result[1]=elements[Math.round(Math.random()*elements.length)];
                if (Jumptime==10){
                                    setJumptime(0);

                }
                else {                setJumptime(10);
}
       }
       }>点我</Button>
      {elements[Math.round(Math.random()*elements.length)]}

      </div>




}